Placeholders
Table of Contents
Quality placeholders pay it forward #
Using placeholder content is helpful when creating layouts that don’t have approved content, but repetative, and reused placeholder content that doesn’t reflect the actual content that will often cause to to miss things that will become problems down the road. If you mock up a card where every title is the sme 5 words, you won’t be prepared when the client imports the content with 15 word titles of various word lengths.
Placeholder content can be text, images, video, charts, graphs or tables, user/author data, and any other content type required by the design. This page is an attemt to gather some resources in one place to make it easy to find.
Two problems with Placeholder content #
The first problem with placeholder content is that it can be too consistent. As much as we try to get our clients to follow the suggested wordcount, and adhere to the limatation, we always find them to be pushing the bounderies. We have to be ready for that, and one tool that we have is to use varried content. The best place to get content is from the client’s current website. Use thier actual blog post titles in the designs and eliminate the guess work. If you don’t have that to work with, at least provide variations in word cound AND word length. That hero at size 72 font looks great in Figma on desktop, but once the user put the work “institutionalizing” in their hero statement, and you’re viewing it at that width just before the mobile breakpoint, you’ve got a problem. Better to identify that sooner than later if you can.
The second problem with placeholder content is that the client can get attached to it, or confused by it. A great way to generate dummy text right now is with Chat GPT. Ask it to write 25 words descibing the purpose of an electrical panel and you’ve got real content in the same time that you could copy/paste lorem ipsum. That’s great to have a simulation of the final content, but make sure your client doesn’t get confused that think that’s the real thing, if you don’t mean for that to stick around.
Not just for design #
The first reason that we pull placeholder content is because we need something to work with to create the layout. You may have a lo-fi wireframe that you fill with placeholder content, and start adding the brand colors, fonts, and logo so it starts to feel like the real thing. Obviously you need something to work with to test the layout and see how it feels.
The other reason that we need layout, as we’ve eluded to above, it for development. We need a variety of content to test the layout from a development perspective. We need to know what this site will look like with 200 blog posts with a number of different categories. We need to see how the author block will look at the bottom of the post, so we’ll need users with profile images and bios. Creating them manually is a lot of manual effort. There are some WordPress specific tools at the bottom of this list that can help developers vet their theme to make sure it can handle a wide variety of posts, and other custom post types filled with content that contains text and images with different layout and alignments on the page.
Text #
Lorem Ipsum #
https://www.lipsum.com/ - We all know it. It has he visual rhythm of real text, but it is less likely to distract the viewer from looking at the layout as a whole
Chat GPT #
https://codeception.com/quickstart - You can generate realistic content quickly, but it could be distracting to the client if they thing that it’s final copy. Hey, if you want to use it for final copy, that’s great, too, just make sure it’s acurate before proposing it as real content.
Images and Photos #
http://dummy-image-generator.com/
MidJourney and DAL-E #
Use AI to create some very specific placeholder image. Compose images in the size and aspect ratio that you need to fit the design.
WordPress Specific #
https://wordpress.org/plugins/fakerpress/
https://codex.wordpress.org/Theme_Unit_Test
Featured image by Annie Spratt on Unsplash